<template>
  <div id='tmpl'>
    <ul class="mui-table-view">
        <li class="mui-table-view-cell mui-media" v-for="item in list">
          <router-link v-bind="{to:'/news/newsinfo/'+item.id}">
            <img class="mui-media-object mui-pull-left" :src="item.img_url">
            <div class="mui-media-body">
              {{item.title}}
              <p class='mui-ellipsis'>{{item.zhaiyao}}</p>
              <div class="timer">
                <span>发表时间：{{item.add_time | datefmt('YYYY-MM-DD HH:mm:ss')}}</span>
                <span class="click">点击数：{{item.click}}</span>
              </div>
            </div>
          </router-link>
        </li>
      </ul>
  </div>
</template>
<script>
import {Toast} from "mint-ui";
import common from "../../common/common.js";
  export default{
      data(){
        return {
          list:[
            /*{
              "id": 13,
              "title": "1季度多家房企利润跌幅超50% 去库存促销战打响",
              "add_time": "2015-04-16T03:50:28.000Z",
              "zhaiyao": "房企一季度销售业绩已经陆续公布，克而瑞研究中心统计",
              "click": 1,
              "img_url": "http://www.webhm.top:8080/upload/201504/16/201504161149414479.jpg"
            },
            {
              "id": 14,
              "title": "买房还是炒股，2015年买房无法拒绝的5大理由",
              "add_time": "2015-04-16T04:05:34.000Z",
              "zhaiyao": "转眼间2015年已经过去了4个月，在这短短的四个月",
              "click": 2,
              "img_url": "http://www.webhm.top:8080/upload/201504/16/201504161205596364.jpg"
            }*/
            ]
        }
      },
      created(){
        this.getnewslist()
      },
      methods:{
        getnewslist(){
          var url=common.apidomain+'/api/getnewslist';
          this.$http.get(url).then(function(responce){
            var data=responce.body;
            if(data.status!=0){
              Toast(data.message);
              return
            }
            this.list=data.message;
          })
        }
      }
  }
</script>
<style scoped>
  .mui-table-view .mui-media-object {
    max-width: 100px;
    height: 80px;
  }
  .mui-table-view-cell p {
    margin:10px 0;
  }
  .timer {
    color:#0094ff;
    margin-left: 10px;
    font-size: 14px;
  }
  .click {
    margin-left:20px;
  }
</style>